html,
body,
#app{
  margin: 0;
  width: 100%;
  min-width: 500px;
  height: 100%;
  font-family: "Open Sans", sans-serif;
  display: flex;
  flex-direction: column;
  background: #F7EED6;
}

body, h1, h2, h3 {
  font-weight: 300
}

.flipButton{
  background: #c73e3a;
  color: #fff;
  font-size: 15px;
  border-color: transparent;
  border-radius:20px;
  width: 8em;
  height: 4%;
  cursor: pointer;
}

.flipButton:hover {
  box-shadow: 0px 0px 10px 1px rgb(199 62 58 / 70%);
}

.flipButton:disabled {
  background: #807d7d;
  color: #fff;
}

.resetButton{
  margin-left: 2em;
  background: #807d7d;
  color: #fff;
  font-size: 15px;
  border-color: transparent;
  border-radius:20px;
  width: 8em;
  height: 4%;
  cursor: pointer;
}

.resetButton:hover {
  box-shadow: 0px 0px 10px 1px #807d7d;
}
